<template>
	<view>
		<view>
			<image class="response cu-capsule" src="/static/images/head/bg_bargain.jpg" mode="widthFix"></image>
		</view>

		<view class="cu-card">
			<view class="cu-item">
				<navigator class="flex solid-bottom padding" hover-class="none" v-for="(item,index) in 5" :key="index" url="view">
					<image class="item-img" src="../../static/common.jpg" mode=""></image>
					<view class="item-info margin-left flex flex-direction justify-between">
						<view class="text-cut text-lg">标题标题标题标题标题标题标题标题标题</view>
						<view class="text-gray">
							<text class="cuIcon-group"></text>
							<text class="padding-left-xs">201人正在参与</text>
						</view>
						<view class="flex justify-between align-center">
							<view class="text-red">可砍至：<text class="text-price text-lg">10.00</text></view>
							<view class="">
								<button class="cu-btn round bg-red sm shadow-blur">
									<view class="cuIcon-tag padding-right-xs"></view>参与砍价
								</button>
							</view>
						</view>
					</view>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	page {
		background: linear-gradient(#f94b4d, #f95250);
	}

	.bg-bargain {
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}

	.cu-card {
		position: absolute;
		top: 650upx;

		.cu-item {
			border: 6upx solid #fc8b42;
			border-radius: 30upx;

			.item-img {
				width: 160upx;
				height: 160upx;
			}

			.item-info {
				width: 428upx; // 750-4*30+30+160+12
			}
		}
	}
</style>
